import { useAntdTable } from 'ahooks';
import { Button, Input, Table } from 'antd';

import Filter from '@/components/filter';

import { usePermission } from '@/auth';
import { TimeSort } from '@/enum';
import { safeHazardStatisticsPage } from '@/services/bizApi/anquanyinhuantongjijiekou';

/** 该模块增删改查对象 */
export type BizObject = BIZAPI.SafeHazardStatisticsEntity;

const Page: React.FC = () => {
  const permission = usePermission();
  const [filter] = Filter.useForm();

  const table = useAntdTable(
    async ({ current, pageSize }, { id, ...formData }) => {
      const res = await safeHazardStatisticsPage({
        ...formData,
        ...id,
        page: current,
        size: pageSize,
        timeSort: TimeSort.倒序
      });

      return {
        list: res.data?.records || [],
        total: res.data?.total || 0
      };
    },
    {
      form: filter
    }
  );

  const onSearch = () => {
    table.search.submit();
  };

  const onReset = () => {
    table.search.reset();
  };

  return (
    <>
      {/* 筛选 */}
      <Filter onFinish={onSearch} form={filter}>
        <Filter.Item name="inspectedUnitName">
          <Input
            style={{
              width: 180
            }}
            placeholder="请输入公司"
          />
        </Filter.Item>
        <Filter.Item>
          <Button htmlType="submit" disabled={table.loading}>
            搜索
          </Button>
        </Filter.Item>

        <Filter.Item>
          <Button onClick={onReset} disabled={table.loading}>
            重置
          </Button>
        </Filter.Item>
      </Filter>
      {/* end 筛选 */}

      {/* 表格 */}
      <Table<BizObject>
        size="small"
        columns={[
          {
            title: '序号',
            dataIndex: 'index',
            align: 'center',
            width: 60,
            render: (_text, _record, index) => index + 1
          },
          {
            title: '受检公司名称',
            dataIndex: 'inspectedUnitName'
          },
          {
            title: '隐患总数',
            dataIndex: 'total'
          },
          {
            title: '安全隐患总数',
            dataIndex: 'total1'
          },
          {
            title: '环保隐患总数',
            dataIndex: 'total2'
          },
          {
            title: '整改完成条数',
            dataIndex: 'done'
          },
          {
            title: '安全整改完成调整',
            dataIndex: 'done1'
          },
          {
            title: '环保整改完成条数',
            dataIndex: 'done2'
          },
          {
            title: '整改率',
            dataIndex: 'doneRate'
          },
          {
            title: '安全整改率',
            dataIndex: 'doneRate1'
          },
          {
            title: '环保整改率',
            dataIndex: 'doneRate2'
          },
          {
            title: '及时率',
            dataIndex: 'timelinessRatio'
          },
          {
            title: '安全整改及时率',
            dataIndex: 'timelinessRatio1'
          },
          {
            title: '环保整改及时率',
            dataIndex: 'timelinessRatio2'
          }
        ]}
        scroll={{
          x: 'max-content'
        }}
        rowKey="id"
        bordered
        {...table.tableProps}
        pagination={{
          ...table.tableProps.pagination,
          showTotal: (total) => `共 ${total} 条`,
          showQuickJumper: true,
          showSizeChanger: true,
          pageSizeOptions: ['10', '20', '50', '100']
        }}
      />
      {/* end表格 */}
    </>
  );
};

export default Page;
